<template>
	<!-- 新增入库申请单 -->
	<view>
		<view class="card-wrapper">
			<!-- 主表 -->
			<view class="radius shadow shadow-lg bg-white padding-sm light bg-blue">
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">集团:</view>
					<view class="basis-xl text-black solid-bottom position-r"
						:class="activeLineIndex == 1 ? 'solid-bottom-blue' :'' ">
						<input class="wc-input" type="text" disabled v-model="mainOrder.GROUPNAME" placeholder="选择集团" />
					</view>
				</view>
				<view class="flex flex-wrap margin-top" @tap="activeIndexM(2,'BA_ORGANIZE')">
					<view class="basis-xs">组织:</view>
					<view class="basis-xl text-black solid-bottom position-r"
						:class="activeLineIndex == 2 ? 'solid-bottom-blue' :'' ">
						<input class="wc-input" name="STORENAME" type="text" disabled v-model="mainOrder.ORGNAME"
							placeholder="选择组织" />
						<view class="basis-xs text-right position-a down-arrow-btn">
							<text class="cuIcon-triangledownfill text-xxl text-bold"
								:class="activeLineIndex == 2 ? 'text-blue' :'' "></text>
						</view>
					</view>
				</view>
				<view class="flex flex-wrap margin-top" @tap="activeIndexM(0,'BA_DEPARTMENT')">
					<view class="basis-xs">部门:</view>
					<view class="basis-xl text-black solid-bottom position-r">
						<input class="wc-input" disabled name="STORENAME" type="text" v-model="mainOrder.DEPTNAME"
							placeholder="选择部门" />
						<view class="basis-xs text-right position-a down-arrow-btn">
							<text class="cuIcon-triangledownfill text-xxl text-bold"
								:class="activeLineIndex == 3 ? 'text-blue' :'' "></text>
						</view>
					</view>
				</view>

				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">申请人:</view>
					<view class="basis-xl text-black solid-bottom position-r"
						:class="activeLineIndex == 5 ? 'solid-bottom-blue' :'' ">
						<input class="wc-input width60" disabled name="STORENAME" type="text"
							v-model="mainOrder.APPLYER" placeholder="请选择" />
					</view>
				</view>

				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">供应商:</view>
					<view class="basis-xl text-black solid-bottom position-r"
						:class="activeLineIndex == 4 ? 'solid-bottom-blue' :'' " @tap="activeIndexM(4,'BD_SUPPLIER')">
						<!-- {{ mainOrder.SUPPLYNAME || '' }} -->
						<input class="wc-input width60" disabled name="STORENAME" type="text"
							v-model="mainOrder.SUPPLYNAME" placeholder="请选择" />
						<view class="basis-xs text-right position-a down-arrow-btn">
							<text class="cuIcon-triangledownfill text-xxl text-bold"
								:class="activeLineIndex == 4 ? 'text-blue' :'' "></text>
						</view>
					</view>
				</view>

				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">备注:</view>
					<view class="basis-xl text-black solid-bottom" :class="isActiveNote? 'solid-bottom-blue' :'' ">
						<input @focus="activeNote" @blur="getNote" class="wc-input" type="text"
							v-model="mainOrder.VMEMO" placeholder="请输入" />
					</view>
				</view>
			</view>
			<!-- 物资子表 -->
			<view class="radius shadow shadow-lg bg-white padding-sm margin-top sub-table"
				v-for="(item,index) in checkData" :key="index">
				<view class="text-red delete-cicon" @click="removeEvent(index)">
					<i class="dicon">&#xe937;</i>
				</view>

				<view class="flex flex-wrap">
					<view class="basis-xs">物资单号</view>
					<view class="basis-xl text-black">{{ item.PK_MATERIAL }}</view>
				</view>
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">物资名称</view>
					<view class="basis-xl text-black">
						{{ item.MATERIALNAME || item.VNAME || '' }}
					</view>
				</view>

				<view class="flex flex-wrap margin-top line-height-30">
					<view class="basis-xs">税率</view>
					<view class="basis-xl solid-bottom sub-table-input">
						<picker @change="bindPickerChange($event,index)" :value="item.myindex01" :range="taxRate"
							range-key="ItemName" class="picker-wrap">
							<view>{{ taxRate[item.myindex01].ItemName}}</view>
							<text class="dicon diconxiangxiazhankai position-a down-arrow"></text>
						</picker>
					</view>
				</view>

				<view class="flex flex-wrap margin-top line-height-30">
					<view class="basis-xs">含税单价</view>
					<view class="basis-xl solid-bottom sub-table-input">
						<input class="wc-input" v-model="item.NQTORIGTAXPRICE" type="number" placeholder="请输入含税单价" />
					</view>
				</view>

				<view class="flex flex-wrap margin-top line-height-30">
					<view class="basis-xs">申请数量</view>
					<view class="basis-xl solid-bottom sub-table-input">
						<input class="wc-input" v-model="item.NNUM" type="number" placeholder="请输入到货量" />
					</view>
				</view>
			</view>

			<view class>
				<button class="cu-btn block bg-blue margin-tb-sm lg" @click="submit">提交</button>
			</view>
		</view>

	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from "vuex";
	import wPicker from "@/components/w-picker/w-picker.vue";
	import api from "@/common/api.js";
	import utils from "@/common/util.js";
	// var graceChecker = require("../../common/graceChecker.js");
	let query = {
		category: "ST_INAPPLY",
		page: 1,
		rows: "50",
		sidx: "",
		sord: "",
		queryJson: {},
		userId: "",
		account: "admin"
	};
	let _self, dateTimekey, activeIndex, VMEMO, BILLFROM, activeType;
	export default {
		computed: mapState(["userInfo", "baseUrl", "taxRate", "checkData"]),
		data() {
			return {
				mainOrder: {
					PK_GROUP: "",
					GROUPNAME: "",
					PK_ORG: "",
					ORGNAME: "",
					PK_DEPT: "",
					DEPTNAME: "",
					PK_APPLYER: "",
					APPLYER: "",
					PK_SUPPLY: "",
					SUPPLYNAME: "",
					PK_STORE: "",
					STORENAME: "",
					BILLFROM: 0,
					VMEMO: "",
					userId: "",
					account: ""
				},

				isActiveNote: false,
				isActiveStore: false,
				mid: "",
				today: utils.getToDay(),
				dateTimekey: "",
				// activeIndex:'',
				activeLineIndex: 0,
				label01: "单号" // 主表的第一个label BD_MATERIAL
			};
		},
		components: {
			wPicker
		},
		onLoad(p) {
			// console.log(p);
			_self = this;
			this.initSetData();
		},
		onShow() {
			uni.$on("getSelectItem", function(data) {
				console.log(data);
				switch (activeType) {
					case "GROUP":
						_self.mainOrder.GROUPNAME = data.FullName;
						_self.mainOrder.PK_GROUP = data.OrganizeId;
						break;
					case "BA_ORGANIZE":
						_self.mainOrder.ORGNAME = data.FullName;
						_self.mainOrder.PK_ORG = data.OrganizeId;
						break;
					case "BA_DEPARTMENT":
						_self.mainOrder.DEPTNAME = data.FullName;
						_self.mainOrder.PK_DEPT = data.DepartmentId;
						break;
					case "BD_SUPPLIER":
						_self.mainOrder.SUPPLYNAME = data.VNAME;
						_self.mainOrder.PK_SUPPLY = data.BILLNO;
						break;
					case "BA_USER":
						_self.mainOrder.APPLYER = data.RealName;
						_self.mainOrder.PK_APPLYER = data.UserId;
						break;
					case "BD_STORE": // 仓库
						if (_self.activeSub) {
							_self.checkData[_self.activeLineIndex].PK_STORE = data.BILLNO;
							_self.checkData[_self.activeLineIndex].STORENAME = data.VNAME;
						} else {
							_self.mainOrder.PK_STORE = data.BILLNO;
							_self.mainOrder.STORENAME = data.VNAME;
						}
						break;
					case "BD_RACK": // 货位
						if (_self.activeSub) {
							_self.checkData[_self.activeLineIndex].STATIONNAME = data.FULLVNAME;
							_self.checkData[_self.activeLineIndex].PK_STATION = data.BILLNO;
						}
						break;
					case "EQBOM": // 设备
						if (_self.activeSub) {
							_self.checkData[_self.activeLineIndex].EQUIPNAME = data.FULLVNAME;
							_self.checkData[_self.activeLineIndex].PK_EQUIP = data.BILLNO;
						}
						break;

					default:
						break;
				}
			});
		},
		onUnload() {
			uni.$off("getSelectItem", function(data) {});
		},

		onNavigationBarButtonTap(e) {
			e.index == 0 ? this.addItem() : _self.openScanMater();
		},

		methods: {
			...mapMutations(["deleteCheckData", "setCheckData"]),
			// 初始化赋值
			initSetData() {
				// console.log(JSON.stringify(this.checkData));
				query.userId = _self.userInfo.UserId;
				query.account = _self.userInfo.Account;
				_self.mainOrder.GROUPNAME = _self.userInfo.GROUPNAME || "";
				_self.mainOrder.PK_GROUP = _self.userInfo.PK_GROUP;
				_self.mainOrder.ORGNAME = _self.userInfo.ORGNAME;
				_self.mainOrder.PK_ORG = _self.userInfo.ORGANIZEID;
				_self.mainOrder.DEPTNAME = _self.userInfo.DEPTNAME;
				_self.mainOrder.PK_DEPT = _self.userInfo.DEPARTMENTID;
				_self.mainOrder.APPLYER = _self.userInfo.REALNAME;
				_self.mainOrder.PK_APPLYER = _self.userInfo.UserId;
				_self.mainOrder.userId = _self.userInfo.UserId;
				_self.mainOrder.account = _self.userInfo.Account;
			},
			// 扫码物资
			openScanMater() {

			},

			// 根据扫描结果查询物资信息
			bindPickerChange: function(e, i) {
				let val = e.target.value;
				_self.activeIndex = i;
				_self.checkData[_self.activeIndex].myindex01 = val;
				_self.checkData[_self.activeIndex].NTAXRATE =
					_self.taxRate[val].ItemValue;
			},

			getNote(e) {
				// console.log(e)
				this.mainOrder.VMEMO = e.target.value;
			},
			onConfirm(val) {
				this.checkData[activeIndex][dateTimekey] = val.result;
			},

			activeIndexM(i, t) {
				_self.activeLineIndex = i;
				activeType = t;
				let queryParames = "",
					pk_my_org = "";
				if (t == "BA_DEPARTMENT") {
					pk_my_org = this.mainOrder.PK_ORG;
				} else if (t == "BA_ORGANIZE") {
					pk_my_org = this.mainOrder.PK_GROUP;
				}

				uni.navigateTo({
					url: "/pages/public/search?t=" +
						t +
						"&organizeId=" +
						pk_my_org +
						"&queryjson=" +
						queryParames
				});
			},
			activeNote() {
				_self.isActiveNote = true;
			},
			addItem() {
				uni.navigateBack({});
			},

			// 删除的操作
			removeEvent(i) {
				let d = this.checkData[i].myIndex + "";
				if (this.checkData.length == 1) {
					return this.$utils.tips("最后一项不可删除");
				}
				uni.$emit("deleteEvent", d);
				this.deleteCheckData(i);
			},

			submit() {
				let data = {
					..._self.mainOrder,
					Detail: _self.checkData
				};
				let URL = api.apiPublic.SaveInApply;
				// console.log(URL);
				console.log(_self.checkData);
				for (var i = 0, datalength = _self.checkData.length; i < datalength; i++) {
					let el = _self.checkData[i]
					console.log(777, el.NQTORIGTAXPRICE);
					if (!el.NQTORIGTAXPRICE) {
						return this.$utils.tips('请输入单价')
					} else if (el.NNUM == '') {
						return this.$utils.tips('请输入申请数量')
					}
				}

				this.axios({
					url: URL,
					data: data,
					isLoading: 1
				}).then(res => {
					uni.showToast({
						icon: "none",
						title: "提交成功"
					});
					_self.setCheckData([]);
					utils.delayBack();
				})
			}
		}
	};
</script>

<style scoped>
	.card-wrapper {
		padding: 26upx;
	}

	.line-height-30 {
		line-height: 24px !important;
	}

	.sub-table-input {
		margin-top: 10upx;
	}

	.width60 {
		width: 60%;
	}

	.down-arrow-btn {
		top: -20upx;
		right: 0upx;
		font-size: 40upx;
		padding: 10upx;
	}

	.add-btn-wrap {
		position: fixed;
		bottom: 100upx;
		right: 50upx;
	}

	.add-btn-wrap .cuIcon-add {
		font-size: 50upx;
	}
</style>